<template>
  <div>
    <div class="w-form-header">
      <div class="header">
        <!-- <div class="title-box">
          <span class="title">
            {{ route.query.ID ? "修改起模通知单" : "添加起模通知单" }}</span>
        </div> -->
        <div>
          <div v-if="type == 'update'">
            <el-button type="primary" @click="saveByRole">保存</el-button>
          </div>
        </div>
        <!-- <div class="title-box" v-if="type == 'update'">
          <span class="version"> 版本: {{ detail.version || '暂无' }}</span>
        </div> -->
      </div>
    </div>
    <div class="gva-form-box admin-content">
      <div class="form-box">
        <el-form
          :model="formData"
          ref="elFormRef"
          label-position="right"
          label-width="140px"
        >
          <el-row :gutter="24" style="padding-right: 1.5rem">
            <el-col :span="8">
              <el-form-item
                label="款式编号："
                prop="styleNum"
                :rules="[
                  {
                    required: true,
                    message: '请选择',
                    trigger: 'blur',
                  },
                ]"
              >
                <el-select
                  v-model="formData.styleNum"
                  placeholder="请选择"
                  style="width: 100%"
                  filterable
                  disabled
                  remote
                  :remote-method="remoteMethodProjectStyles"
                  @change="productStylesChange"
                  :disabled="formData.status == '1'"
                >
                  <el-option
                    v-for="item in productStylesList.filter(
                      (item) => item.status == '1'
                    )"
                    :key="item.styleNum"
                    :label="item.styleNum"
                    :value="item.styleNum"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item
                label="客户要求完成日期："
                prop="customerDemandDate"
              >
                <el-date-picker
                  v-model="formData.customerDemandDate"
                  type="date"
                  placeholder="请选择"
                  value-format="YYYY-MM-DDTHH:mm:ssZ"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="PI要求完成日期：" prop="piDemandDate">
                <el-date-picker
                  v-model="formData.piDemandDate"
                  type="date"
                  placeholder="请选择"
                  value-format="YYYY-MM-DDTHH:mm:ssZ"
                />
              </el-form-item>
            </el-col>
            <!-- <el-col :span="8">
              <el-form-item label="生产地点：">
                <el-select v-model="formData.transferOrder" :clearable="true">
                  <el-option
                    v-for="(item, index) in transferOrder"
                    :key="index"
                    :label="item"
                    :value="item"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col> -->
            <el-col :span="24">
              <el-form-item label="配件备注：" prop="accessoryNote">
                <el-input
                  type="textarea"
                  :maxlength="200"
                  v-model="formData.accessoryNote"
                  :clearable="true"
                  placeholder="自定义填写"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <!-- 尺码-------------------------------------- -->
          <div class="gva-form-box">
            <div class="w-form-box">
              <div class="list-header">尺码</div>
              <div>
                <el-table :data="drawingLists" style="width: 100%" border>
                  <el-table-column prop="size" label="尺码" width="180">
                    <template #default="scope">
                      {{ scope.$index + 1 }}
                    </template>
                  </el-table-column>
                  <el-table-column prop="sizeNum" label="尺码编号">
                  </el-table-column>
                  <el-table-column prop="drawingList" label="产品规格图">
                    <template #default="scope">
                      <el-select
                        v-model="scope.row.drawingList"
                        placeholder="请选择"
                        :clearable="true"
                      >
                        <el-option
                          v-for="item in scope.row.drawingLists"
                          :key="item.ID"
                          :label="item.drawingName"
                          :value="item.fileUrl"
                        >
                        <span>{{ item.drawingName }}{{ (item.status==0 ? '(草稿)' : item.status==1?'(完成)' : item.status==2 ? '(审批中)' : '') }}</span>
                        </el-option>
                      </el-select>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" width="300">
                    <template #default="{ row, $index }">
                      <el-space wrap>
                        <!-- <a v-if="row.drawingList"
                          :href="`dayuer-cadopen:${path1}${row.drawingList}?ID=${row.ID}&action=view&X-Token=${xToken}`">查看</a> -->
                        <a
                          v-if="row.drawingName"
                          href="javascript:void(0)"
                          class="image-icon"
                          @click="downloadFile(row)"
                          >下载图纸</a
                        >
                      </el-space>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>
          </div>
        </el-form>
      </div>
    </div>

    <!-- 生成本场颜色描述弹窗 -->
    <el-dialog v-model="subDialogFormVisible" title="添加修改备注" width="800">
      <el-form :model="subForm" :rules="subFormRules">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="内容分类：" prop="contentCate">
              <el-checkbox-group v-model="subForm.contentCate">
                <el-checkbox
                  v-for="item in contentCateList"
                  :label="item.label"
                  :value="item.value"
                  style="display: block"
                />
              </el-checkbox-group>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="原因分类：" prop="reasonCate">
              <el-checkbox-group v-model="subForm.reasonCate">
                <el-checkbox
                  v-for="item in reasonCateList"
                  :label="item.label"
                  :value="item.value"
                  style="display: block"
                />
              </el-checkbox-group>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="详细说明" prop="materialNum">
              <el-input
                type="textarea"
                :maxlength="200"
                :clearable="true"
                placeholder="自定义填写"
                v-model="subForm.remark"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="subDialogCel">取消</el-button>
          <el-button type="primary" @click="saveByRole"> 确定 </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 模房复期 -->
    <!-- 添加模房付期 -->
    <el-dialog
      v-if="boardMakingVisible"
      v-model="boardMakingVisible"
      destroy-on-close
      width="50%"
      title="模房复期"
    >
      <el-form ref="boardMakingFormRef" :model="boardMakingForm">
        <el-row>
          <el-col :span="24">
            <el-form-item label="复期日期：">
              <el-date-picker
                v-model="boardMakingForm.deliveryDate"
                type="date"
                value-format="YYYY-MM-DDTHH:mm:ssZ"
                placeholder="选择日期"
                :clearable="true"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="详细说明：" style="width: 100%">
              <textarea
                v-model="boardMakingForm.detailDescription"
                :rows="5"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="addBoardMakingSubmit"
            >确定</el-button
          >
          <el-button
            @click="(boardMakingForm = {}), (boardMakingVisible = false)"
            >取消</el-button
          >
        </div>
      </template>
    </el-dialog>

    <!-- 审核模房付期 -->
    <el-dialog
      v-if="auditBoardMakingVisible"
      v-model="auditBoardMakingVisible"
      destroy-on-close
      width="50%"
      title="模房复期"
    >
      <el-form ref="auditBoardMakingFormRef" :model="auditBoardMakingForm">
        <el-row>
          <el-col :span="24">
            <el-form-item label="付期日期：">
              <el-radio-group v-model="auditBoardMakingForm.status">
                <el-radio
                  value="通过"
                  size="large"
                  border
                  style="color: #67c23a"
                  >通过</el-radio
                >
                <el-radio
                  value="拒绝"
                  size="large"
                  border
                  style="color: #f56c6c"
                  >拒绝</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="详细说明：" style="width: 100%">
              <textarea
                v-model="auditBoardMakingForm.auditDescription"
                :rows="5"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="auditBoardMakingSubmit"
            >确定</el-button
          >
          <el-button
            @click="
              (auditBoardMakingForm = {}), (auditBoardMakingVisible = false)
            "
            >取消</el-button
          >
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { onMounted, reactive, toRefs, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { getProductStylesList } from "@/api/plmProductStyles";
import { getProductSpecSizeList } from "@/api/productSpecSize";
import { getDdmsSpecDrawingListList } from "@/api/ddmsSpecDrawingList";
import {
  createMoldStartNotice,
  findMoldStartNotice,
  setMetalSpleenPrint,
  updateMoldStartNotice,
  createMoldStartNoticeMoldHouse,
  getMoldStartNoticeMoldHouseList,
  updateMoldStartNoticeMoldHouse,
} from "@/api/plmMoldStartNotice";
import LTable from "@/components/LTable/LTable.vue";
import { emitter } from "@/utils/bus.js";
import { updateMoldStartNoticeMoldmaterialList } from "@/api/moldStartNoticeMoldmaterialList";
import { downloadFilePost } from "@/api/comment.js";
import { getDict } from "@/utils/dictionary";
import { ElMessage, ElMessageBox } from "element-plus";
import { formatDate } from "@/utils/format";
export default {
  name: "plmMoldStartNoticeAddAndEdit",
  components: {
    LTable,
  },
  setup() {
    const route = useRoute();
    const router = useRouter();
    const state = reactive({
      formData: {
        styleNum: "",
        customerDemandDate: undefined,
        piDemandDate: undefined,
        accessoryNote: undefined,
        // FirstCreatedAt:"",
        // transferOrder: undefined,
      },
      productStylesList: [], //款式列表
      type: "create",
      drawingLists: [],
      detail: {},
      subDialogFormVisible: false,
      subForm: {
        reasonCate: undefined,
        contentCate: undefined,
        remark: "",
      },
      wuliaoList: [],
      subFormRules: {
        reasonCate: [{ required: true, message: "请选择", trigger: "blur" }],
        contentCate: [{ required: true, message: "请选择", trigger: "blur" }],
      },
      reasonCateList: [], //原因分类
      contentCateList: [], //内容分类
      selectList: [], //模具及物料清单选中项
      allowClick: true,
      transferOrder: [],
    });
    const path1 = ref(import.meta.env.VITE_BASE_API + "/");
    const xToken = localStorage.getItem("token");
    // 初始化方法
    const init = async () => {
      // 建议通过url传参获取目标数据ID 调用 find方法进行查询数据操作 从而决定本页面是create还是update 以下为id作为url参数示例
      if (route.query.ID) {
        if (route.query.styleNum) {
          
          state.type = "update";

          const res = await findMoldStartNotice({ ID: route.query.ID,noticeNum: route.query.noticeNum });
        if (res.code === 0) {
          state.detail = res.data.remoldStartNotice;
          state.formData.styleNum = state.detail.styleNum;
          // state.drawingLists = state.detail.drawingLists;
          if (state.detail.customerDemandDate) {
            state.formData.customerDemandDate = state.detail.customerDemandDate;
          }
          if (state.detail.piDemandDate) {
            state.formData.piDemandDate = state.detail.piDemandDate;
          }
          if (state.detail.accessoryNote) {
            state.formData.accessoryNote = state.detail.accessoryNote;
          }
          if (state.detail.transferOrder) {
            state.formData.transferOrder = state.detail.transferOrder;
          }
          productStylesChange(state.detail.styleNum);
        }
        }
      }
    };
    // 款式发生改变时
    function productStylesChange(params) {
      getProductSpecSizeList({ styleNum: params, page: 1, pageSize: 999 }).then(
        (res) => {
          if (res.code == 0) {
            state.drawingLists = res.data.list;
            state.drawingLists.forEach((item, index) => {
              getDdmsSpecDrawingListList({
                sizeNum: item.sizeNum,
                styleNum: item.styleNum,
                page: 1,
                pageSize: 999,
              }).then((result) => {
                item.drawingLists = result.data.list;
                if (
                  Array.isArray(state.detail.drawingLists) &&
                  state.detail.drawingLists.length
                ) {
                  item.drawingName = state.detail.drawingLists.filter(
                    (it) => it.sizeNum == item.sizeNum
                  )[0].drawingName;
                  item.drawingList = state.detail.drawingLists.filter(
                    (it) => it.sizeNum == item.sizeNum
                  )[0].drawingList;
                  item['ddmsNum'] = state.detail.drawingLists.filter(
                    (it) => it.sizeNum == item.sizeNum
                  )[0].ddmsNum;
                  item['ddmsNumVersion'] = state.detail.drawingLists.filter(
                    (it) => it.sizeNum == item.sizeNum
                  )[0].ddmsNumVersion;
                } else {
                  item.drawingName = "";
                  item['ddmsNum'] = "";
                  item['ddmsNumVersion'] = "";
                }
              });
            });
            getTransferOrderRange(params);
          }
        }
      );
    }

    // 获取生产地列表
    const getTransferOrderRange = async (keyword) => {
      console.log(keyword);
      await getProductStylesList({
        page: 1,
        pageSize: 50,
        styleNum: keyword ? keyword : undefined,
      }).then((res) => {
        if (res.code == 0) {
          state.transferOrder = res.data.list[0].transferOrderRange;
        }
      });
    };

    
    // 金打印啤打印
    function print(params) {
      if (params == 1) {
        setMetalSpleenPrint({
          status: 1,
          setType: "metal",
          styleNum: state.formData.styleNum,
        }).then((res) => {
          if (res.code == 0) {
            ElMessage({
              type: "success",
              message: "金打印完成",
              duration: 1000,
              onClose: () => {
                router.go(-1);
              },
            });
          }
        });
      } else if (params == 2) {
        setMetalSpleenPrint({
          status: 1,
          setType: "spleen",
          styleNum: state.formData.styleNum,
        }).then((res) => {
          if (res.code == 0) {
            ElMessage({
              type: "success",
              message: "啤打印完成",
              duration: 1000,
              onClose: () => {
                router.go(-1);
              },
            });
          }
        });
      }
    }

    function back(params) {
      router.go(-1);
    }

    function saveByRole(params) {
      if (!state.formData.styleNum) {
        ElMessage({
          type: "warning",
          message: "请选择款式编号",
        });
        return;
      }

      if (!state.formData.customerDemandDate) {
        ElMessage({
          type: "warning",
          message: "请选择客户要求完成日期",
        });
        return;
      }

      if (!state.formData.piDemandDate) {
        ElMessage({
          type: "warning",
          message: "请选择PI要求完成日期",
        });
        return;
      }

      
     
      if (!state.allowClick) {
        return;
      } else {
        state.allowClick = false;
        setTimeout(() => {
          state.allowClick = true;
        }, 3000);
      }
      let datas = {
        ...state.formData,
        noticeNum: route.query.noticeNum,
        drawingLists: state.drawingLists.map((item) => {
          // let val = {
          //   drawingList: item.drawingLists?.filter(
          //     (it) => it.drawingName == item.drawingName
          //   ).length
          //     ? item.drawingLists.filter(
          //         (it) => it.drawingName == item.drawingName
          //       )[0].fileUrl
          //     : "",
          //   drawingName: item.drawingName,
          //   sizeNum: item.sizeNum,
          // };
          let val = {}
          val['drawingName'] = item.drawingLists?.filter(
            (it) => it.fileUrl == item.drawingList
          )[0]?.drawingName || '';
          val['drawingList'] = item.drawingLists?.filter(
            (it) => it.fileUrl == item.drawingList
          )[0]?.fileUrl || '';
          val['ddmsNum'] = item.drawingLists?.filter(
            (it) => it.fileUrl == item.drawingList
          )[0]?.ddmsNum || '';
          val['ddmsNumVersion'] = item.drawingLists?.filter(
            (it) => it.fileUrl == item.drawingList
          )[0]?.version || '';
          val['sizeNum'] = item.sizeNum;
          return val;
        }),
      };
      if (!datas.drawingLists.some(item=>item.drawingList)) {
        ElMessage({
          type: "warning",
          message: "请选择产品规格图",
        });
        return;
      }
     
      updateMoldStartNotice(datas).then((res) => {
        if (res.code == 0) {
          ElMessage({
            type: "success",
            message: "提交成功",
            duration: 1000,
            onClose: () => {
              emitter.emit("closeThisPage");
              router.push({
                path: "/layout/moldStartNotice",
              });
            },
          });
        }
      });
    }

    function subAndopenDialog(params) {
      state.subDialogFormVisible = true;
    }

    // 获取款式列表
    const remoteMethodProjectStyles = (keyword) => {
      getProductStylesList({
        page: 1,
        pageSize: 50,
        styleNum: keyword ? keyword : undefined,
        status: 1,
        searchType: "moldStartNotice",
        productSpecStatus: 1,
      }).then((res) => {
        if (res.code == 0) {
          state.productStylesList = res.data.list;
        }
      });
    };

    // 关闭提交弹窗
    function subDialogCel(params) {
      state.subForm = {
        reasonCate: undefined,
        contentCate: undefined,
        materialNum: "",
      };
      state.subDialogFormVisible = false;
    }

    // 模具及物料清单选中
    const handleSelectionChange = (val) => {
      console.log(val);
      state.selectList = val;
    };

    // 修改状态
    function changeStatus(params) {
      let newMoldmaterialLists = JSON.parse(
        JSON.stringify(state.detail.moldmaterialLists)
      );
      if (params == "正常") {
        state.selectList.forEach((item) => {
          newMoldmaterialLists.forEach((val) => {
            val.noticeNum = state.detail.noticeNum;
            if (val.ID == item.ID) {
              val.status = "正常";
            }
          });
        });
      } else if (params == "暂停") {
        state.selectList.forEach((item) => {
          newMoldmaterialLists.forEach((val) => {
            val.noticeNum = state.detail.noticeNum;
            if (val.ID == item.ID) {
              val.status = "暂停";
            }
          });
        });
      } else if (params == "终止") {
        state.selectList.forEach((item) => {
          newMoldmaterialLists.forEach((val) => {
            val.noticeNum = state.detail.noticeNum;
            if (val.ID == item.ID) {
              val.status = "终止";
            }
          });
        });
      }
      updateMoldStartNoticeMoldmaterialList(newMoldmaterialLists).then(
        (res) => {
          if (res.code == 0) {
            ElMessage({
              type: "success",
              message: "状态修改成功",
              duration: 1000,
              onClose: () => {
                state.detail.moldmaterialLists = newMoldmaterialLists;
                state.selectList = [];
              },
            });
          }
        }
      );
    }

    function statusChange(datas, params) {
      let newMoldmaterialLists = JSON.parse(JSON.stringify(datas));
      newMoldmaterialLists.status = params;
      updateMoldStartNoticeMoldmaterialList([
        { ...newMoldmaterialLists, noticeNum: state.detail.noticeNum },
      ]).then((res) => {
        if (res.code == 0) {
          ElMessage({
            type: "success",
            message: "状态修改成功",
            duration: 1000,
            onClose: () => {
              datas.status = params;
            },
          });
        }
      });
    }
    //模房复期

    const boardMakingColumns = ref([]);
    const newBoardMakingColumns = [
      {
        prop: "ID",
        label: "序号",
        show: true,
        tableColumnProps: {
          sortable: false,
        },
      },
      {
        prop: "deliveryDate",
        label: "付期日",
        show: true,
        tableColumnProps: {
          sortable: false,
          formatter: (row) => formatDate(row.deliveryDate),
        },
      },

      {
        prop: "detailDescription",
        label: "详细说明",
        show: true,
        tableColumnProps: {
          sortable: false,
        },
      },
      {
        prop: "createUser",
        label: "创建人/时间",
        show: true,
        tableColumnProps: {
          sortable: false,
          formatter: (row) => row.createUser + " " + formatDate(row.CreatedAt),
        },
      },
      {
        prop: "status",
        label: "状态",
        show: true,
        slot: "status",
        tableColumnProps: {
          sortable: false,
        },
      },

      {
        prop: "auditUser",
        label: "审核人/时间",
        show: true,
        tableColumnProps: {
          sortable: false,
          formatter: (row) => row.auditUser + " " + formatDate(row.auditDate),
        },
      },
      {
        prop: "auditDescription",
        label: "审核说明",
        show: true,
        tableColumnProps: {
          sortable: false,
        },
      },
    ];
    boardMakingColumns.value = newBoardMakingColumns;
    const boardMakingTalbeData = ref([]);
    const boardMakingForm = ref({});
    const boardMakingFormRef = ref();
    const auditBoardMakingForm = ref({});
    const auditBoardMakingFormRef = ref();
    const boardMakingVisible = ref(false);
    const auditBoardMakingVisible = ref(false);
    const changeBoardMakingVisible = (bool) => {
      boardMakingVisible.value = bool;
    };
    function addBoardMaking() {
      boardMakingForm.value = {};
      changeBoardMakingVisible(true);
    }
    function addBoardMakingSubmit() {
      boardMakingFormRef.value.validate(async (valid) => {
        if (valid) {
          const params = {
            ...boardMakingForm.value,
            noticeNum: state.detail.noticeNum,
          };
          console.log("params==============", params);
          const res = await createMoldStartNoticeMoldHouse(params);
          if (res.code === 0) {
            boardMakingForm.value = {};
            ElMessage({
              type: "success",
              message: "添加成功",
            });
            changeBoardMakingVisible(false);
            getMoldStartNoticeMoldHouseList({
              noticeNum: state.detail.noticeNum,
            }).then((res) => {
              if (res.code === 0) {
                boardMakingTalbeData.value = res.data.list;
              }
            });
          }
        }
      });
    }
    const changeAuditBoardMakingVisible = (bool) => {
      auditBoardMakingVisible.value = bool;
    };
    function auditBoardMaking(row) {
      auditBoardMakingForm.value = {
        ID: row.ID,
      };
      changeAuditBoardMakingVisible(true);
    }
    function auditBoardMakingSubmit() {
      auditBoardMakingFormRef.value.validate(async (valid) => {
        if (valid) {
          const params = {
            ...auditBoardMakingForm.value,
            noticeNum: state.detail.noticeNum,
          };
          console.log("audit params========================", params);
          const res = await updateMoldStartNoticeMoldHouse(params);
          if (res.code === 0) {
            auditBoardMakingForm.value = {};
            ElMessage({
              type: "success",
              message: "审核成功",
            });
            changeAuditBoardMakingVisible(false);
            getMoldStartNoticeMoldHouseList({
              noticeNum: state.detail.noticeNum,
            }).then((res) => {
              if (res.code === 0) {
                boardMakingTalbeData.value = res.data.list;
              }
            });
          }
        }
      });
    }

    // 下载
    const downloadFile = (row) => {
      let params = {
          drawingName: row.drawingName,
          fileUrl: row.drawingList,
      };
      downloadFilePost(params).then((data) => {
        if (data.response && data.response.status == 404) {
            ElMessage({
                type: "warning",
                message: "文件不存在",
            });
            return;
        }
        let blob = new Blob([data.data], {});
        const fileName = row.drawingName;
        const url = window.URL.createObjectURL(blob);
        const link = document.createElement("a");
        link.style.display = "none";
        link.href = url;
        link.setAttribute("download", fileName);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link); // 下载完成移除元素
        window.URL.revokeObjectURL(url); // 释放掉blob对象
    });
      // console.log(row);
      // let name =
      //   row.drawingList.split("/")[row.drawingList.split("/").length - 1];
      // const path = ref(import.meta.env.VITE_BASE_PATH + "/");
      // let fileUrl;
      // if (
      //   row.drawingList.indexOf("http://") > -1 ||
      //   row.drawingList.indexOf("https://") > -1
      // ) {
      //   fileUrl = row.drawingList.replace(new RegExp("#", "g"), "");
      // } else {
      //   fileUrl =
      //     path.value + row.drawingList.replace(new RegExp("#", "g"), "");
      // }
      // const x = new XMLHttpRequest();
      // x.open("GET", fileUrl, true);
      // x.responseType = "blob";
      // x.onload = (e) => {
      //   // 会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。
      //   const url = window.URL.createObjectURL(x.response);
      //   const a = document.createElement("a");
      //   a.href = url;
      //   a.download = name;
      //   a.click();
      // };
      // x.send();
    };
    onMounted(() => {
      init();
    });

    return {
      ...toRefs(state),
      route,
      productStylesChange,
      back,
      saveByRole,
      subAndopenDialog,
      print,
      remoteMethodProjectStyles,
      formatDate,
      subDialogCel,
      handleSelectionChange,
      changeStatus,
      statusChange,
      path1,
      xToken,
      // 模房复期
      boardMakingColumns,
      boardMakingTalbeData,
      addBoardMaking,
      addBoardMakingSubmit,
      boardMakingForm,
      boardMakingFormRef,
      auditBoardMakingForm,
      auditBoardMakingFormRef,
      boardMakingVisible,
      auditBoardMakingVisible,
      auditBoardMaking,
      auditBoardMakingSubmit,
      downloadFile,
    };
  },
};
</script>

<style lang="scss" scoped>
.form-header {
  font-size: 22px;
  font-weight: 600;
  background: #fff;
  padding: 20px;
  border-bottom: 1px solid #ccc5;
}

.form-box {
  margin: 0 auto;
}

.form-footer {
  text-align: center;
  margin-top: 20px;
}

.table-form {
  margin-bottom: 40px;

  .el-form-item {
    margin-bottom: 0;
    width: 80%;
  }

  .table-title {
    margin-bottom: 20px;
    margin-top: 20px;
    font-size: 16px;
    font-weight: bold;
    line-height: 16px;
  }
}
</style>
<style lang="scss" scoped>
@import url("@/style/common/common.scss");

:deep(.el-descriptions__label) {
  min-width: 100px !important;
}

:deep(.el-descriptions__cell) {
  min-width: 100px !important;

  .el-date-editor.el-input,
  .el-date-editor.el-input__wrapper {
    width: unset;
    min-width: 120px;
  }
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.title-box {
  display: flex;
  align-items: center;

  .title {
    font-size: 20px;
    font-weight: 600;
    margin-right: 8px;
  }
}
</style>
